import type { EChartsOption } from "echarts";
import * as echarts from 'echarts/core'

export function getOption(): EChartsOption{
	//柱状图  渐变色双y轴

	//可以鼠标滚动

	//点击背景和点击图形触发不同的事件

	let dataList = [{
		name: '2009年',
		value: '56'
	}, {
		name: '2010年',
		value: '75'
	}, {
		name: '2011年',
		value: '85'
	}, {
		name: '2012年',
		value: '78'
	}, {
		name: '2013年',
		value: '76'
	}, {
		name: '2014年',
		value: '45'
	}, {
		name: '2015年',
		value: '100'
	}, {
		name: '2016年',
		value: '78'
	}, {
		name: '2017年',
		value: '76'
	}, {
		name: '2018年',
		value: '45'
	}, {
		name: '2019年',
		value: '100'
	}];
	var img = [
		'image://',
		'image://',
		'image://',
		'image://',
	];
	var datacoords:any = [{
		coords: [
			['2009年', 56],
			['2010年', 75],
			['2011年', 85],
			['2012年', 78],
			['2013年', 76],
			['2014年', 45],
			['2015年', 100],
			['2016年', 78],
			['2017年', 76],
			['2018年', 45],
			['2019年', 100],
		]
	}]

	return {
		backgroundColor: 'rgb(20,28,52)',
		grid: {
			left: "10%", //距离左边的距离
			right: "13%", //距离右边的距离
			bottom: "10%", //距离下边的距离
			top: "8%" //距离上边的距离
		},
		title: {
			text: '',
			left: 26,
			top: 26,
			textStyle: {
				color: '#7184C6',
				fontSize: 15,
				fontWeight: 50000,
				fontFamily: 'PingFang SC'
			}
		},

		tooltip: {
			trigger: "axis",
			axisPointer: {
				type: "shadow",
				crossStyle: {
					color: "#999"
				}
			},
		},
		xAxis: [{
			type: "category",
			data: ['2009年', '2010年', '2011年', '2012年', '2013年', '2014年', '2015年', '2016年', '2017年', '2018年', '2019年'],
			axisLabel: {
				color: "#ffffff",
				fontSize: 16,
				fontFamily: "Microsoft YaHei"
			},


			axisTick: {
				show: false
			},
			axisLine: {
				show: true,
				lineStyle: {
					color: '#7490D4',
				}
			},
		}],
		yAxis: [{
			type: "value",
			axisLabel: {
				formatter: "{value}",
				color: "#7184C6",
				fontSize: 15,
				fontFamily: "Microsoft YaHei"
			},
			splitLine: {
				show: false
			},
			axisLine: {
				show: true,
				lineStyle: {
					color: '#7490D4',
				}
			},
			axisTick: {
				show: false
			}
		},
			{
				type: "value",
				axisLabel: {
					formatter: "{value}%",
					color: "#7184C6",
					fontSize: 15,
					fontFamily: "Microsoft YaHei"
				},
				splitLine: {
					show: false
				},
				axisLine: {
					show: true,
					lineStyle: {
						color: '#7490D4',
					}
				},
				axisTick: {
					show: false
				}
			}
		],

		series: [{
			name: "GDP",
			type: "bar",
			data: dataList,
			barGap: '-100%',
			barCategoryGap: '60%',
			itemStyle: {
				color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
					offset: 0,
					color: '#26D0C3'
				},
					{
						offset: 1,
						color: '#3eb5dd'
					}
				]),
			},

		},
			{
				name: "增长速度",
				type: "line",
				symbolSize: 130,
				symbol: img[3],
				yAxisIndex: 1,
				data: dataList,
				itemStyle: {
					color: "#dcf776"
				}
			},
			{
				name: '滑行的光点',
				type: 'lines',
				coordinateSystem: 'cartesian2d',
				symbolSize: 30,
				polyline: true,
				effect: {
					show: true,
					trailLength: 0,
					period: 10, //光点滑动速度
					symbolSize: 150,
					symbol: img[0]
				},
				lineStyle: {
					width: 1,
					opacity: 0.6,
					curveness: 0.2
				},
				data: datacoords
			}
		]
	}
}
